/**
 * 载入项目引导文件
 */
require('./bootstrap');

window.Vue = require('vue');

const app = new Vue({
    el: '#wrapper',
    data:{
        table:null,
        searchParams:{
            keyword:'',
        },
        key_list:page_params.data_key_list,
        templateData:{},
        box:null,
    },
    watch:{
        templateData:function (val) {
            //console.log(val);
        }
    },
    mounted:function(){
        let tableOptions = utils.bootstraptableOptions;
        //请求后台的URL
        tableOptions.url = page_params.url_list;
        //搜索参数
        tableOptions.queryParams = (params) => {//传递参数（*）
            //这里的键的名字和控制器的变量名必须一直，这边改动，控制器也需要改成一样的
            var temp = {
                pageSize:params.pageSize,
                page:params.pageNumber,
            };
            return _.merge(temp, this.searchParams);
        };
        tableOptions.columns = [
            {field: 'id', title: '#'},
            {field: 'template_key_str', title: '模板标识'},
            {field: 'template_id', title: '模板ID'},
            {field: 'title', title: '模板名称'},
            {field: 'primary_industry', title: '所属行业的一级行业',visible:false,},
            {field: 'deputy_industry', title: '模板所属行业的二级行业',visible:false,},
            {
                field: 'content', title: '模板内容', formatter: function (value, row, index) {
                    return '<pre>' + value + '</pre>'
                },
            },
            {
                field: 'example', title: '模板示例',visible:false, formatter: function (value, row, index) {
                    return '<pre>' + value + '</pre>'
                },
            },
            {
                field: 'operate',
                title: '操作',
                formatter: function (value, row, index) {
                    let buttons = [];
                    if (page_params.url_edit) {
                        buttons.push('<button class="btn btn-primary btn-edit"><i class="fa fa-pencil"></i> 编辑</button>');
                    }
                    if (page_params.url_del) {
                        buttons.push('<button class="btn btn-warning btn-del"><i class="fa fa-trash"></i> 删除</button>');
                    }
                    return buttons.join("\r\n");
                },//自定义方法，添加操作按钮
                events: {
                    'click .btn-edit': (e, value, row, index) => {
                        this.templateData = row;
                        this.box = layer.open({
                            type: 1,
                            title: '编辑模板',
                            shadeClose: true,
                            anim: 2,
                            skin: 'layui-layer-molv', //加上边框
                            area: ['550px', '280px'], //宽高
                            content: $('#box-form')
                        });
                        return false;
                    },
                    'click .btn-del': (e, value, row, index) => {
                        utils.confirm(page_params.url_del, {'id': row.id}, (response, data) => {
                            layer.close(box);
                            table.bootstrapTable('refresh');
                        });
                    }
                }
            },
        ];
        this.table = $("#table").bootstrapTable(tableOptions);
    },
    methods: {
        query: function () {
            this.table.bootstrapTable('refresh');
        },
        add: function(){//添加
            this.templateData = {template_id_short:'',template_key:''};
            this.box = layer.open({
                type: 1,
                title: '新增模板',
                shadeClose: true,
                anim: 2,
                skin: 'layui-layer-molv', //加上边框
                area: ['600px', '330px'], //宽高
                content: $('#box-form')
            });
        },
        save:function(){//保存模板设置
            let saveUrl = this.templateData.id ? page_params.url_edit : page_params.url_add;
            utils.ajaxPost(saveUrl, this.templateData, (response, postdata) => {
                let data = response.data;
                utils.showToastr(data);
                if (data.status == 'success') {
                    layer.close(this.box);
                    this.query();
                }
            });
        },
        sync: function () {
            //同步模板数据
            utils.confirm(page_params.url_sync, {}, (response, postdata) => {
                let data = response.data;
                utils.showToastr(data);
                if (data.status == 'success') {
                    this.query();
                }
            }, '你确定同步线上模板么？', '该同步过程可能花费一些时间');
        }
    },
    components: {

    },
});

let box;

//构建行业选择元素
let buildIndustryHtml = (domId, parentId, defaultVal) => {
    let html = '<option value="0">请选择行业</option>';
    if (page_params.data_industry_list[parentId]) {
        _.each(page_params.data_industry_list[parentId], function (n, k) {
            html += '<option  value="' + n.id + '" ' + (n.id == defaultVal ? 'selected' : '') + '>' + n.name + '</option>';
        });
    }
    $('#' + domId).html(html);
}

$(function () {
    //行业切换
    $('#primary_industry_first_class').change(function () {
        buildIndustryHtml('primary_industry_second_class', $(this).val(), page_params.data_industry_set.primary_industry_id);
    });
    $('#secondary_industry_first_class').change(function () {
        buildIndustryHtml('secondary_industry_second_class', $(this).val(), page_params.data_industry_set.secondary_industry_id);
    });
    //设置行业
    $("#btn-setIndustry").on('click', function () {
        $("#box-setIndustry form").resetForm();
        $("#box-setIndustry form").attr('action', page_params.url_setindustry);
        buildIndustryHtml('primary_industry_first_class', 0, page_params.data_industry_set.primary_industry_first_class);
        buildIndustryHtml('primary_industry_second_class', page_params.data_industry_set.primary_industry_first_class, page_params.data_industry_set.primary_industry_id);
        buildIndustryHtml('secondary_industry_first_class', 0, page_params.data_industry_set.secondary_industry_first_class);
        buildIndustryHtml('secondary_industry_second_class', page_params.data_industry_set.secondary_industry_first_class, page_params.data_industry_set.secondary_industry_id);
        box = layer.open({
            type: 1,
            title: '行业设置',
            shadeClose: true,
            anim: 2,
            skin: 'layui-layer-molv', //加上边框
            area: ['600px', '330px'], //宽高
            content: $('#box-setIndustry')
        });
    });
    //保存行业设置
    $("#box-setIndustry .btn-sub").on('click', function () {
        let postData = {
            primary_industry_id: $("#primary_industry_second_class").val(),
            primary_industry_first_class: '',
            primary_industry_second_class: '',
            secondary_industry_id: $("#secondary_industry_second_class").val(),
            secondary_industry_first_class: '',
            secondary_industry_second_class: '',
        };
        if (postData.primary_industry_id != "0") {
            postData.primary_industry_first_class = $("#primary_industry_first_class").find("option:selected").text();
            postData.primary_industry_second_class = $("#primary_industry_second_class").find("option:selected").text();
        }
        if (postData.secondary_industry_id != "0") {
            postData.secondary_industry_first_class = $("#secondary_industry_first_class").find("option:selected").text();
            postData.secondary_industry_second_class = $("#secondary_industry_second_class").find("option:selected").text();
        }
        utils.ajaxSubmitForm($("#box-setIndustry form"), '', postData, (response, postdata) => {
            data = response.data;
            utils.showToastr(data);
            if (data.status == 'success') {
                utils.reload(0);
            }
        });
    });
});